import { bind_platform_application_info } from '@/services/instiution';
import { ProDescriptions } from '@ant-design/pro-components';
import { Divider, Modal, Spin } from 'antd';
import { useEffect, useState } from 'react';
interface Iprops {
  isShowInitiatedModal: (show: boolean) => void;
  isInitiatedModalOpen: boolean;
  status: number;
  id: number | undefined;
  //   actionRef: React.MutableRefObject<ActionType | undefined>;
}
const InitiatedCheck = (props: Iprops) => {
  const { isInitiatedModalOpen, isShowInitiatedModal, status, id } = props;
  // 存储审批详情信息
  const [info, setInfo] = useState(undefined);
  // 获取详情信息
  useEffect(() => {
    const getData = async () => {
      let request_body = {
        id,
      };
      let params = await bind_platform_application_info(request_body);
      console.log('详情信息', params);
      setInfo(params.data);
    };
    getData();
  }, []);

  return (
    <Modal
      title="详情"
      centered
      open={isInitiatedModalOpen}
      onCancel={() => isShowInitiatedModal(false)}
      destroyOnClose={true}
      width={1000}
      footer={null}
    >
      <Divider />
      {info === undefined ? (
        <div
          style={{
            margin: '20px 0',
            marginBottom: '20px',
            padding: '30px 50px',
            textAlign: 'center',
          }}
        >
          <Spin size="large" />
        </div>
      ) : (
        <>
          <ProDescriptions
            title="申请信息"
            column={4}
            request={async () => {
              return Promise.resolve({
                success: true,
                data: info,
              });
            }}
            columns={[
              {
                title: '机构名称',
                key: 'text',
                dataIndex: 'application_name',
              },

              {
                title: '机构编号',
                key: 'application_unique_code',
                dataIndex: 'application_unique_code',
              },
              {
                title: '机构账号',
                key: 'application_phone',
                dataIndex: 'application_phone',
              },
              {
                title: '申请人',
                key: 'username',
                dataIndex: 'username',
              },
              {
                title: '申请时间',
                key: 'create_time',
                dataIndex: 'create_time',
              },
              {
                title: '状态',
                key: 'status',
                dataIndex: 'status',
                valueType: 'select',
                valueEnum: {
                  0: {
                    text: '待审批',
                  },
                  1: {
                    text: '已同意',
                  },
                  2: {
                    text: '已拒绝',
                  },
                },
                render: (_: any, record) => (
                  <>
                    {record.status === 0 ? '待审批' : ''}
                    {record.status === 1 ? '已同意' : ''}
                    {record.status === 2 ? '已拒绝' : ''}
                  </>
                ),
              },
              {
                title: '申请原因',
                key: 'reason',
                dataIndex: 'reason',
              },
            ]}
          ></ProDescriptions>
          <Divider />
          <ProDescriptions
            title="关联机构信息"
            column={4}
            request={async () => {
              return Promise.resolve({
                success: true,
                data: info,
              });
            }}
            columns={
              status === 0
                ? [
                    {
                      title: '机构名称',
                      key: 'text',
                      dataIndex: 'bind_name',
                    },

                    {
                      title: '机构编号',
                      key: 'bind_unique_code',
                      dataIndex: 'bind_unique_code',
                    },
                    {
                      title: '机构账号',
                      key: 'bind_phone',
                      dataIndex: 'bind_phone',
                    },
                  ]
                : [
                    {
                      title: '机构名称',
                      key: 'bind_name',
                      dataIndex: 'bind_name',
                    },

                    {
                      title: '机构编号',
                      key: 'bind_unique_code',
                      dataIndex: 'bind_unique_code',
                    },
                    {
                      title: '机构账号',
                      key: 'bind_phone',
                      dataIndex: 'bind_phone',
                    },
                    {
                      title: '审批人',
                      key: 'application_username',
                      dataIndex: 'application_username',
                    },
                    {
                      title: '审批时间',
                      key: 'application_time',
                      dataIndex: 'application_time',
                    },
                    {
                      title: `${status === 1 ? '同意原因' : '拒绝原因'}`,
                      key: 'reason',
                      dataIndex: `${status === 1 ? 'agree_reason' : 'refuse_reason'}`,
                    },
                  ]
            }
          ></ProDescriptions>
        </>
      )}
      <br />
    </Modal>
  );
};
export default InitiatedCheck;
